<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<html>
<head>
<title>角色用户配置</title>
<script type="text/javascript">
	var $userGrid;
	var $dataRoleDataGrid;
	var $roleDataGrid;
	var selectDataRolesTableRow;//选中的行数据
	var selectRoleTableRow;//选中的行数据
	$(function() {
		$userGrid = $("#userGrid").datagrid($.extend(datagridOption, {
			url : "${ctx}/basic/roleUsers/userDataGrid",
			pageSize : 1000,
			pageList : [1000, 2000 ],
			columns : [ [ {
				field : 'ck',
				checkbox : true
			}, {
				field : 'loginNo',
				title : '登录账号',
				width : 100,
				sortable : true
			}, {
				field : 'trueName',
				title : '姓名',
				width : 160,
				sortable : true
			} ] ]
		/*,
					onCheck : function(index, row) {
						fn_configRoleUser([ row ], 'check');
					},
					onUncheck : function(index, row) {
						fn_configRoleUser([ row ], 'uncheck');
					} ,
					onCheckAll : function(rows) {
						fn_configRoleUser(rows, 'check');
					},
					onUncheckAll : function(rows) {
						fn_configRoleUser(rows, 'uncheck');
					} */
		}));

		$dataRoleDataGrid = $("#dataRoleDataGrid").datagrid($.extend(datagridOption, {
			url : "${ctx}/basic/roleUsers/dataRolesDataGrid",
			title : "",
			toolbar : '#datarolett',
			columns : [ [ {
				field : 'ck',
				checkbox : true
			}, {
				field : 'dataRoleName',
				title : '数据角色名称',
				width : 120,
				sortable : true
			}, {
				field : 'dataRoleNo',
				title : '数据角色编号',
				width : 100,
				sortable : true
			} ] ],
			onClickRow : function(rowIndex, rowData) {
				selectDataRolesTableRow = rowData;
				$roleDataGrid.datagrid("clearSelections").datagrid("clearChecked");
				$("#cc").layout("panel", "east").panel({
					title : "数据角色【" + rowData.dataRoleName + "】配置用户"
				});
				fn_refreshUsersByDataRole();
			}
		}));
		$roleDataGrid = $("#roleDataGrid").datagrid($.extend(datagridOption, {
			title : "角色",
			url : "${ctx}/basic/roleUsers/rolesDataGrid",
			toolbar : '#rolett',
			columns : [ [ {
				field : 'ck',
				checkbox : true
			}, {
				field : 'roleName',
				title : '角色名称',
				width : 120,
				sortable : true
			}, {
				field : 'roleNo',
				title : '角色编号',
				width : 180,
				sortable : true
			} ] ],
			onClickRow : function(rowIndex, rowData) {
				$.easyui.loading({ msg: "正在加载...", locale: "#userLayout" });
				selectRoleTableRow = rowData;
				$dataRoleDataGrid.datagrid("clearSelections").datagrid("clearChecked");
				$("#cc").layout("panel", "east").panel({
					title : "角色【" + rowData.roleName + "】配置用户"
				});
				fn_refreshUsersbyRole();
			}
		}));
		/*$userGrid.datagrid('enableFilter');
		$dataRoleDataGrid.datagrid('enableFilter');
		$roleDataGrid.datagrid('enableFilter'); */
		$("#userRolesAdd").click(function() {
			fn_userRolesSave();
		});

		//角色查询
		$("#rolesearch").click(function() {
			var condition = "{search_LIKE_roleName:'" + $("#search_LIKE_roleName").val() + "'}";
			condition = eval('(' + condition + ')');
			$roleDataGrid.datagrid("load", condition || {});
		});

		//数据角色查询
		$("#datarolesearch").click(function() {
			var condition = "{search_LIKE_dataRoleName:'" + $("#search_LIKE_dataRoleName").val() + "'}";
			condition = eval('(' + condition + ')');
			$dataRoleDataGrid.datagrid("load", condition || {});
		});
	});
	function fn_configRoleUser(rows, action) {
		var userIds = "";
		for (var i = 0; i < rows.length; i++) {
			if (rows[i].id) {
				userIds += (rows[i].id + ",");
			}
		}
		$.post("${ctx}/basic/roleUsers/" + action, {
			userIds : userIds,
			roleId : selectRoleTableRow ? selectRoleTableRow.id : ""
		}, function(result) {
			$.messager.show({
				msg : result.msg,
				icon : "info",
				position : "bottomRight"
			});
		}, 'json');
	}
	function fn_userRolesSave() {
		var dataRoleSelectData = selectDataRolesTableRow;
		var roleSelectData = selectRoleTableRow;
		var userCheckData = $userGrid.datagrid("getChecked");
		if (dataRoleSelectData == null && roleSelectData == null) {
			$.messager.show({
				msg : "请先勾选需要分配的角色或数据角色",
				icon : "warning",
				position : "bottomRight"
			});
			return false;
		}
		if (userCheckData == null || userCheckData.length < 1) {
			$.messager.show({
				msg : "请选择将要分配的用户集！",
				icon : "warning",
				position : "bottomRight"
			});
			return false;
		}
		var userIds = "";
		for (var i = 0; i < userCheckData.length; i++) {
			if (userCheckData[i].id) {
				userIds += (userCheckData[i].id + ",");
			}
		}

		$.post("${ctx}/basic/roleUsers/addRoles", {
			userIds : userIds,
			roleId : roleSelectData ? roleSelectData.id : "",
			dataRoleId : dataRoleSelectData ? dataRoleSelectData.id : ""
		}, function(result) {
			$.messager.show({
				msg : result.msg,
				icon : "info",
				position : "bottomRight"
			});
			if (result.success) {
				//$userGrid.datagrid("load");
			}
		}, 'json');
	}
	function fn_refreshUsersbyRole() {
		if (!selectRoleTableRow) {
			$.messager.show({
				msg : "请先选定角色!",
				icon : "warning",
				position : "bottomRight"
			});
			return false;
		}
		$.get("${ctx}/basic/roleUsers/jsonRoleUsers?roleId=" + selectRoleTableRow.id, function(result) {
			$.easyui.loaded("#userLayout");
			if (result.success && result.obj) {
				$userGrid.datagrid("clearChecked");
				if (result.obj) {
					for (var i = 0; i < result.obj.length; i++) {
						var node = $userGrid.datagrid("getRowIndex", result.obj[i].id);
						if (node > -1) {
							$userGrid.datagrid("checkRow", node);
						}
					}
				}
			} else {
				$.messager.show({
					msg : result.msg,
					icon : "info",
					position : "bottomRight"
				});
			}
		}, 'json');
	}
	function fn_refreshUsersByDataRole() {
		if (!selectDataRolesTableRow) {
			$.messager.show({
				msg : "请先选定数据角色!",
				icon : "warning",
				position : "bottomRight"
			});
			return false;
		}
		$.get("${ctx}/basic/roleUsers/jsonDataRoleUsers?dataRoleId=" + selectDataRolesTableRow.id, function(result) {
			if (result.success && result.obj) {
				$userGrid.datagrid("clearChecked");
				if (result.obj) {
					for (var i = 0; i < result.obj.length; i++) {
						var node = $userGrid.datagrid("getRowIndex", result.obj[i].id);
						if (node > -1) {
							$userGrid.datagrid("checkRow", node);
						}
					}
				}
			} else {
				$.messager.show({
					msg : result.msg,
					icon : "info",
					position : "bottomRight"
				});
			}
		}, 'json');
	}
</script>
</head>

<body class="easyui-layout" data-options="fit:true,border:false">
	<div data-options="region:'center'" data-options="fit:true" style="padding: 1px;">
		<div id="cc" class="easyui-layout" data-options="fit:true" style="width: 400px; height: 480px;">
			<div data-options="region:'west', split: true, collapsible:true" style="padding: 1px; witdh: 300px">
				<table id="roleDataGrid">
				</table>

				<shiro:hasPermission name="roleUsers:update">
					<!-- <div id="tt" class="easyui-toolbar">
						<span>用户姓名：</span> <input type="text" id="search_LIKE_trueName"
						style="margin-left: 2px; margin-right: 2px; padding-left: 2px; padding-right: 3px;" />
					<a id="search" class="easyui-linkbutton" data-options="plain: true, iconCls: 'icon-hamburg-zoom'">查询</a>
					</div>-->
					<div id="tt" class="row">
						<div class="col-md-12">
							<button id="userRolesAdd" type="button" class="btn btn-primary">
								<span class="glyphicon glyphicon-save"></span> 保存配置
							</button>
						</div>
					</div>
				</shiro:hasPermission>
			</div>
			<div style="padding: 1px; witdh: 300px; display: none">
				<table id="dataRoleDataGrid">
				</table>
				<div id="rolett" class="easyui-toolbar">
					<span>角色名称：</span>
					<input type="text" id="search_LIKE_roleName" style="margin-left: 2px; margin-right: 2px; padding-left: 2px; padding-right: 3px;" />
					<a id="rolesearch" class="easyui-linkbutton" data-options="plain: true, iconCls: 'icon-hamburg-zoom'">查询</a>
				</div>
			</div>
			<div id="userLayout" data-options="region:'center',  split: true,title:'用户信息', collapsible:true" style="padding: 1px; witdh: 300px">
				<table id="userGrid">
				</table>
				<div id="datarolett" class="easyui-toolbar">
					<span>数据角色名称：</span>
					<input type="text" id="search_LIKE_dataRoleName" style="margin-left: 2px; margin-right: 2px; padding-left: 2px; padding-right: 3px;" />
					<a id="datarolesearch" class="easyui-linkbutton" data-options="plain: true, iconCls: 'icon-hamburg-zoom'">查询</a>
				</div>
			</div>
		</div>
	</div>
</body>
</html>
